<style type="text/css" rel="stylesheet">
			body{
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
}
.title_div{
	width:100%;
	height:80px;
	margin-bottom:10px;
/* 	border:1px solid red; */
}

.title_div li{
	list-style-type:none;
/* 	border:1px solid red; */
}
.title_div li.title0{
	margin: 0px 0px 10px 10px;
    height: 20px;
    font-size: 1.0em;
    color: red;
}
.title_div li.title1{
	margin:0px 0px 10px 10px;
	height:20px;
	font-size:2.8em;
	color:red;
}
.course_tip{
	margin-left:3%;
}
.course_tip img{
	width:13px;
	height:13px;
	color:red;
}
.title_div li.title{
	height:40px;
	margin:15px 0px 0px 0px;
/* 	border:1px solid red; */
}
.title_div li.title img{
	width:100%;
	height:40px;
	overflow:hidden;
}
.class_div{
	width:100%;
	margin:0px;
}
.class_title{
	width:100%;
	height:30px;
	list-style-type:none;
	margin-left:0px;
	margin-top:10px;
/* 	border:1px solid red; */
}
.class_title li{
	float:left;
	height:30px;
	width:50%;
	text-align:center;
}

.class_title li a{
	display:block;
	margin:0px;
	cursor:pointer;
	text-decoration:none;
}
.title1 a{
	height:30px;
	border-right:2px solid #DDDDDD;
}		
.change1{
	border-bottom:2px solid green;
	color:green;
}
.change2{
	border-bottom:2px solid #DDDDDD;
}
.change1 a{
	color:green;
}
.change2 a{
	color:rgb(60,60,60);
}
 
.title2 a{
	margin:10px 5px 10px 10px;
}
.clear{clear:both;}

#class_show{
	width:100%;
	height:auto;
	margin-top:3%;
}
#class_show li{
	list-style-type:none;
}
.show{
	width:100%;
	height:110px;
	clear:both;
	color:#AAAAAA;
	margin-top:5px;
}
.show li{
	float:left;
	width:71%;
}
.show .show_img{
	width:80px;
	height:100px;
	margin-left:10px;
/* 	border:1px solid red; */
}
.show img{
	width:80px;
	height:100px;
}

.show table{
	width:95%;
	height:100px;
	margin-left:5px;
	border-bottom:2px solid #DDDDDD;
/* 	border:1px solid red; */
}
.show table td{
	height:auto;
}
.table_title{
	vertical-align: bottom;
	color:rgb(60,60,60);
	font-weight:bolder;
}
.table_title span{
	color:red;
}
.table_title span.title_count{
/* 	font-size:1.4em; */
}
.table_teach{
	vertical-align: top;
	color:#999999;
	font-size:0.8em;
}
.table_teach a{
	text-decoration:none;
	color:green;
}
.teach_font{
	font-size:0.8em;
}

#div1 .show .buy {
    border: 1px solid green;  
    font-weight: bold;

}
.show .buy {
    display: block;
    width: 35px;
    text-align: center;
    background-color: #0C0;
    color: white;

}
#div2 .show .buy{
	border:1px solid #2AA5F8;
	color:#2AA5F8;
	font-weight:bold;
/* 	font-size:2.4em; */
}

.banner{
	width:100%;
/* 	x-overflow:hidden; */
	height:100px;
	position:relative;
/* 	border:1px solid red; */
}
.banner li{
	margin:0;
	padding:0;
	list-style-type:none;
}
.banList{
	position:absolute;
	left:0px;
	margin-left:0px;
	margin-top:0px;
	height:100px;
/* 	border:1px solid red; */
}
.banList li{
	width:100%;
	height:100px;
	opacity:0;
	position:absolute;
	transform:scale(0);
	transition:transform 0.5s ease 0s, opacity 1.5s ease 0s;
	z-index:1;
}
.banList img{
 	width:350px;
 	height:100px;
	y-overflow:hidden;
}
.banList li.active{
	opacity:1;
	transform:scale(1);
	z-index:2;
}
.fomW{
	position:absolute;
	bottom:0px;
	left:78%;
	top:78%;
	height:5px;
	z-index:9;
/* 	border:1px solid red; */
}
.jsNav{
	text-align:center;
}
.jsNav a{
	display:inline-block;
	background:#fff;
	width:5px;
	height:5px;
	border-radius:50%;
	margin:2px;
}
.jsNav a.current{background:#fc8f0f;cursor:pointer}
</style>
  <ion-view view-title="快乐语文●报名">
  	<ion-content class="service-content">		
		<div class="title_div">
	    	 <ul>
	    	 	<li class="title"><img src="../../img/course/active_title.jpg"/></li>
	    	 	<li class="title0">
	    	 		<select ng-model="selectedSite1" ng-options="a.startBatch as a.startBatch for a in batch" ng-change="changeAddress(selectedSite1,1)"></select>
					<select ng-model="selectedSite2" ng-options="a.addressId as a.address for a in addressList" ng-change="searchTrainClass(selectedSite1,selectedSite2)"></select>
					<select ng-model="selectedSite3" ng-options="typeId for typeId in classType" 
													 ng-change="searchClassType(selectedSite1,selectedSite2,selectedSite3)">
													<option value="">--请选择--</option>
					</select>											
					<input id="hiddenBatch" type="hidden" value="{{hiddenBatch}}"/>
					<input id="hiddenAddressId" type="hidden" value="{{hiddenAddressId}}"/>
					<input id="hiddenTypeId" type="hidden" value="{{hiddenTypeId}}"/>					 
	    	 	</li>		       													
				<li class="title0">
				</li>
				
	    	 </ul>
	    </div>
	    <div class="banner">
			  <ion-slide-box active-slide="myActiveSlide" does-continue="true" auto-play="true"slide-interval="2000">
				<ion-slide>
				  <img src="../../img/course/adv_01.jpg" style="width:100%; height:100px">
				</ion-slide>
				<ion-slide>
				  <img src="../../img/course/adv_02.jpg" style="width:100%; height:100px">
				</ion-slide>
				<ion-slide>
				  <img src="../../img/course/adv_03.jpg" style="width:100%; height:100px">
				</ion-slide>
				<ion-slide>
				  <img src="../../img/course/adv_04.jpg" style="width:100%; height:100px">
				</ion-slide>				
			  </ion-slide-box>
		</div>
		<div class="class_div">
			<ul class="class_title">
				<li class="{{title1}}"><a id="navon1" ng-click="switchNav('navon1')">即将开课</a></li>
				<li class="{{title2}}"><a id="navon2" ng-click="switchNav('navon2')">正在上课</a></li>
				<div class="clear"></div>
			</ul>
			<div id="class_show">
				<div id="div1" ng-show="div1" ng-repeat="item in divContent1">
					<ul class='show'>
						<li class='show_img'><img ng-src="../../img/course/courses_0{{item.id}}.jpg" ng-click='showCourseDetail({{item.id}})'></li>
						<li>
							<table>
								<tr><td class='table_title'><a ng-click='showCourseDetail({{item.id}})'>{{item.name}}</a></td></tr>
								<tr>
									<td class='teach_font'><a ng-click='showCourseDetail({{item.id}})'>简介:点击左侧图片,查看详情！</a></td>
									<td rowspan='2'><a class="buy" ng-click='click_buy({{item.id}},"1")'>报名</a></td>
								</tr>								
							</table>
						</li>
					</ul>
				</div>
				
				<div id="div2" ng-show="div2" ng-repeat="item in divContent2">
					<ul class='show'>
						<li class='show_img'><img ng-src="../../img/course/courses_0{{item.id}}.jpg" ng-click='showCourseDetail({{item.id}})'></li>
						<li>
							<table>
								<tr><td class='table_title'><a  ng-click='showCourseDetail({{item.id}})'>{{item.name}}</a></td></tr>
								<tr>
									<td class='teach_font'><a  ng-click='showCourseDetail({{item.id}})'>简介:点击左侧图片,查看详情！</a></td>
									<td rowspan='2'><a class="buy" ng-click='click_buy({{item.id}},"0")'>查看</a></td>
								</tr>								
							</table>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</ion-content>
</ion-view>